<template>
  <div class="imgs">
    <a-upload
      name="article_img"
      list-type="picture-card"
      class="avatar-uploader"
      method="post"
      :show-upload-list="false"
      action="http://localhost:3002/article/article_img"
      :withCredentials="true"
      @change="handleChange"
    >
      <div class="size"><a-icon type="file-image" /> 图片</div>
    </a-upload>
  </div>
</template>

<script>
export default {
  name: "BtnsImgs",
  methods: {
    handleChange(info) {
      if (info.file.status === "uploading") {
        this.loading = true;
        return;
      }
      if (info.file.status === "done") {
        //   上传成功
        const response = info.file.response;
        if (response.avatar) {
          const avatar = response.avatar;
          // 触发得到该图片
          this.$bus.$emit("commentImg", avatar);
        }
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.size {
  color: #007fff;
}
</style>